import variables from '@/styles/initial-variables.scss'
import defaultSettings from '@/config/settings'

const {localStoreKey, showSettings, tagsView, fixedHeader, sidebarLogo,isNavBarVisible,isAsideVisible,isFooterBarVisible } = defaultSettings

const storeKey=localStoreKey+'-layout-setting'
const storageSetting = JSON.parse(localStorage.getItem(storeKey)) || ''
const state = {
  theme: storageSetting.theme || variables.theme,
  showSettings: showSettings,
  /* NavBar */
  isNavBarVisible: isNavBarVisible,

  /* FooterBar */
  isFooterBarVisible: isFooterBarVisible,

  /* Aside */
  isAsideVisible: isAsideVisible,
  tagsView: tagsView,
  fixedHeader: fixedHeader,
  sidebarLogo: sidebarLogo
}

const mutations = {
  /* A fit-them-all commit */
  basic (state, payload) {
    state[payload.key] = payload.value
  },
  CHANGE_SETTING: (state, { key, value }) => {
    // eslint-disable-next-line no-prototype-builtins
    debugger
    if (state.hasOwnProperty(key)) {
      state[key] = value
      localStorage.setItem(storeKey,JSON.stringify(state))
    }
  }
}

const actions = {
  changeSetting({ commit }, data) {
    commit('CHANGE_SETTING', data)
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}

